<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Procelain</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    
    <div class="userInfo">
        <ul class="info">
            <li>姓名：<span class="name"></span></li>
            <li>时间：<span class="time">0</span>'S</li>
            <li>得分：<span class="score">0</span></li>
        </ul>
    </div>

    <ul class="group">
        <li>
            <img src="哥釉青花/1.jpg" alt="哥釉青花">
            <div>
                青花名：<input type="text" class="inputBox">
                <button class="btn">确认</button>
            </div>
        </li>
        <li>
            <img src="孔雀绿青花/1.jpg" alt="孔雀绿青花">
            <div>
                青花名：<input type="text" class="inputBox">
                <button class="btn">确认</button>
            </div>
        </li>
        <li>
            <img src="豆青釉青花/1.jpg" alt="豆青釉青花">
            <div>
                青花名：<input type="text" class="inputBox">
                <button class="btn">确认</button>
            </div>
        </li>
        <li>
            <img src="青花五彩/1.jpg" alt="青花五彩">
            <div>
                青花名：<input type="text" class="inputBox">
                <button class="btn">确认</button>
            </div>
        </li>
        <li>
            <img src="青花红彩/1.jpg" alt="青花红彩">
            <div>
                青花名：<input type="text" class="inputBox">
                <button class="btn">确认</button>
            </div>
        </li>
        <li>
            <img src="黄地青花/1.jpg" alt="黄地青花">
            <div>
                青花名：<input type="text" class="inputBox">
                <button class="btn">确认</button>
            </div>
        </li>
        <li>
            <p>测试完成！！！</p>
        </li>
    </ul>

    <script src="js/jquery.min.js"></script>
    <script src="js/function.js"></script>
</body>
</html>